草庐IT

2D 地图绘制

全部标签

javascript - 谷歌地图信息窗口的自定义样式(背景)

我正在使用谷歌地图构建map,但遇到了问题。我正在尝试设置当某些用户单击图钉时打开的信息窗口的样式。我的问题是它确实有效,但它在窗口本身的父div上呈现出奇怪的效果(当有人多次单击我的窗口时,窗口显示一个奇怪的白色边框,这是背景的颜色我的div的父亲具有一类gm-style-iw)。我的代码如下:我的脚本:functioninitMap(){varstyledMapType=newgoogle.maps.StyledMapType([{mycustomstyle}]);varmycompany={lat:44.348534,lng:-79.669197};varmap=newgoogl

javascript - ES6 文件上的谷歌地图回调

我正在尝试在ES6文件上添加回调,但找不到它。我收到此错误消息:“initMap不是函数”我的文件是这样的:&callback=initMap">我的js文件是:exportfunctioninitMap(){map=newgoogle.maps.Map(document.getElementById('map'),{center:{lat:-34.397,lng:150.644},zoom:8});fetch('/data/markers.json').then(function(response){returnresponse.json()}).then(plotMarkers);

javascript - 在 FabricJS 中绘制一条波浪线

我正在使用FabricJS创建用于绘制特定线条和形状的Canvas。其中一条线是带箭头的波浪线,类似这样:我已经成功地创建了一个带有箭头端点的直线版本,但找不到任何关于如何创建波浪线的示例。用户可以根据需要绘制线,因此线中“峰”和“谷”的数量需要相应地调整(像上图这样的短线可能有4个峰,但两倍长度的线会有8个峰,不仅仅是较短线的拉伸(stretch)版本)。这是我用来绘制带有箭头端点的直线的代码。请注意,线的起点是在mousedown上绘制的,终点是在mouseup上绘制的。importLineWithArrowfrom'./LineWithArrow';drawLineWithArr

javascript - 谷歌地图故障 : Closures & Passing By Reference

我遇到了一些Googlemap/Javascript问题。我想我知道问题出在哪里,但就是不知道解决办法。我的问题的一个例子是here.无论您点击什么标记,第二个都会出现。我显然将错误的信息传递到我的事件监听器中,但我似乎无法获得正确的代码。这是代码的一部分:首先,这是我的部分代码:if(GBrowserIsCompatible()&&mapResults!=null){//ReadintheJSONvarmapDetailsArray=loadJSON();//Createamapvarmap=newgoogle.maps.Map2(document.getElementById(el

javascript - 开源客户端基于 JavaScript 的 2D 数据绘图?

我想知道是否有任何使用JavaScript在客户端运行的二维图形绘制库?基本思想是您可以在浏览器中放置一个绘图,用户可以更改X和Y比例和限制、放大和缩小等内容,而无需不断地从服务器重新加载网页。数据本身将通过AJAX获取,如果用户想使用重型工具,这将允许用户直接从服务器wget获取数据。类似于Python的matplotlib的2D部分。这是我很久以前看过的东西,然后决定开发一些只在服务器端生成SVG的代码(使用内置的eCos网络服务器)会更快,但现在我'我一直在阅读Prototype和jQuery之类的东西,我想知道是否有人已经这样做了。 最佳答案

javascript - 如何使用 HTML5 Canvas 而不是 Debug Draw 来绘制我的 Box2D 世界?

我非常了解HTML5Canvas,我了解使用循环等的基础知识和动画。我正在使用的演示:(单击以制作形状)http://henry.brown.name/experiments/box2d/example-canvas.html我不太熟悉的是Box2D。我正在使用Box2DWeb端口,听说它比Box2D-js更新,我不确定哪个最好。我知道如何初始化“世界”并且我可以在世界中放置对象。然后,我使用Step为世界设置动画-但是到目前为止,为了在屏幕上显示它,我只能使用debugdraw来让它工作,因为它基本上会为你做所有事情。我不想使用调试绘图,而是使用Canvas来绘制,例如一辆汽车,而不

javascript - 使用 Javascript 在遍历单位圆时绘制正弦波

我想在穿过单位圆时绘制正弦波。我想将它用于教育目的。我想要的情节类似于下面的情节:此外,我希望x轴的刻度标签涉及π/2、π、3π/2、2π。它可能支持我想说的一些数学。如何使用Javascript绘制这样的单位圆和相应的xy图?我应该使用哪个库?你能提供一个起点吗? 最佳答案 绘图有两种使用javascript“绘制”任意形状的好方法。第一个选项是HTMLcanvas元素。与艺术家Canvas一样,htmlCanvas提供了一个区域,您可以在其中使用javascript绘制任意形状、线条等。第二个选项是SVG绘图。SVG是一种类似于

javascript - 谷歌地图 API : pan to markers from a list.

你好:)请耐心等待,我不是编码员,但我正在尝试边做边学。这是我目前正在处理的页面;http://www.websu.it/devnw/dev/contact.html.我目前使用GoogleMapsAPI设置了一张map,使用了以下javascript:functioninitialize(){varmapOptions={zoom:5,center:newgoogle.maps.LatLng(48.160,-6.832),disableDefaultUI:true,mapTypeId:google.maps.MapTypeId.ROADMAP};map=newgoogle.maps.

javascript - 谷歌地图错误 - a.lng 不是函数

我计划在我的一个应用程序中使用谷歌地图“containsLocation()”API。文档链接是-https://goo.gl/4BFHCz我正在使用相同的示例。这是我的代码。Polygonarrayshtml,body{height:100%;margin:0;padding:0;}#map{height:100%;}//ThisexamplerequirestheGeometrylibrary.Includethelibraries=geometry//parameterwhenyoufirstloadtheAPI.Forexample://functioninitMap(){va

javascript - 谷歌地图最佳实践?

我们开始在我们的网络应用程序中相当广泛地使用Googlemap。一开始它运行良好,但随着我们添加更多标记,我们发现性能不尽如人意。尽管我很确定我们没有以最有效的方式使用它。我正在寻找有关Googlemap最佳实践和技巧的信息。有什么建议吗? 最佳答案 您可能会在thisarticle中找到一些好主意,它比较了处理大量标记的几种方法。标记管理器有一些限制,具体取决于您要完成的任务;例如,它不允许每个标记在每个缩放级别都可用。我根据thistutorial中讨论的原则创建了一个聚类函数。.它使用PHP中的静态mapAPI,但您可以根据需